<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>待办列表</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="../../css/mui.min.css">
    <link href="css/common.css" rel="stylesheet" />
    <style type="text/css">
      .nav{
        border-bottom: 1px solid #DCDCDC;
        background: #fff;
      }
    	.nav-item{
    	  height: 45px;
    	  line-height: 45px;
    	  text-align: center;
    	  
    	}
    	.nav-item.active{
    	  color: #3188fe;
        position: relative;
    	}

      .nav-item.active:after {
        content: "";
        display: block;
        width: 24px;
        height: 3px;
        background: #3188fe;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
      }
    </style>
	</head>
	<body>
	  <header class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
      <h1 class="mui-title">待办</h1>
    </header>
    <div class="mui-content">
      <div class="flex nav" > 
        <div class="flex-sub nav-item active" data="disclose/list.html">技术交底</div>
        <div class="flex-sub nav-item" data="performTasks/carryoutToDo.html">执行待办</div>
        <div class="flex-sub nav-item" data="performTasks/taskList.html">班组级验收</div>
      </div>
    </div>
    
	  <script src="../../js/mui.min.js"></script>
    <script src="./js/mkeyplus.base.js"></script>
    <script type="text/javascript" src="../../js/jquery-3.2.1.min.js"></script>
    <script src="./js/sqlite.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
      if(window.plus) {
        plusready();
      } else {
        document.addEventListener('plusready', plusready, false);
      }
      var subpages = ['disclose/list.html', 'performTasks/carryoutToDo.html', 'performTasks/taskList.html'];
      var subpage_style = {
        top: '92px',
        bottom: '0px'
      };
      var aniShow = {};
      
      function plusready() {
        var self = plus.webview.currentWebview();
        var network = self.network;
        for(var i = 0; i < subpages.length; i++) {
          var temp = {};
          var sub = plus.webview.create(subpages[i], subpages[i], subpage_style,{network:network});
          console.log("窗口ID:" + sub.id);
          if(i != 0) {
            console.log("隐藏的窗口:" + sub.id);
            sub.hide();
          } else {
            temp[subpages[0]] = "true";
            mui.extend(aniShow, temp);
          }
          self.append(sub);
        }

        //默认当前激活选项 ，以及id
        activeTab = subpages[0];
        var defaultt = subpages[0];
        mui(".nav").on("tap", ".nav-item", function() {
          var targetTab = this.getAttribute('data');
          $(this).addClass('active').siblings().removeClass('active')
          if(targetTab == activeTab) {
            return;
          }
          if(mui.os.ios || aniShow[targetTab]) {
            console.log("第二次打开了===" + targetTab);
            plus.webview.show(targetTab, "fade-in", 0);
          } else {
            var temp = {};
            temp[targetTab] = "true";
            mui.extend(aniShow, temp);
            plus.webview.show(targetTab, "fade-in", 0);
          }

          console.log("隐藏的页面：" + activeTab);
          //隐藏当前;
          plus.webview.hide(activeTab);
          activeTab = targetTab;
        });
      }
      
    </script>
	</body>
</html>
